
  
<script setup lang="ts">
import { ref, defineEmits, defineProps } from 'vue'
// 虚拟列表 el-select-v2
const props = defineProps({
  options: {
    type: Array,
    default: []
  },
  // v-model 双向绑定
  modelValue: {
    type: String,
  },
  // 是否多选
  multiple: {
    type: Boolean,
    default: () => false
  },
  // 大小
  size: {
    type: String,
    default: 'small'
  },
  // 是否禁用
  disabled: {
    type: Boolean,
    default: () => false
  },
  // 提示文本
  placeholder: {
    type: String,
    default: () => '请选择'
  },
  // 是否可清空
  clearable: {
    type: Boolean,
    default: () => false
  },
})

const emit = defineEmits(['update:modelValue'])
const selectedValue = ref(props.modelValue) // 下拉框选中的值

</script>

<template>
    <el-select-v2 v-model="selectedValue" class="m-2" :options="props.options" :size="props.size"
      style="width: 240px" :props="{
        label: 'lab',
        value: 'val'
      }" :clearable="props.clearable" @change="emit('update:modelValue', selectedValue)" :multiple="props.multiple"
      :placeholder="props.placeholder" :disabled="props.disabled" />
</template>
<style scoped></style>
  